<html>

<head>
    <style>
        #parent {
            width: 300px;
            height: 300px;
            background-color: red;

        }

        #child {
            width: 150px;
            height: 150px;
            background-color: blue;
        }

    </style>
</head>
<body>
<div id="parent">
    <div id="child">

    </div>
</div>

<script>
    document.querySelector("#parent").addEventListener("click", event => {
        console.log("currentTarget ID: " + event.currentTarget.id);
        console.log("target ID: " + event.target.id);
        console.log("event: ", event);
    }, true)
</script>

</body>
</html>
